<?php
use yii\widgets\ActiveForm;
?>
<link rel="stylesheet" href="../static/bootstrap/css/bootstrap.min.css" type="text/css">
<link rel="stylesheet" href="../static/jBox/Skins/Metro/jbox.css" type="text/css">
<link rel="stylesheet" href="../static/dist/css/AdminLTE.min.css" type="text/css">
<link rel="stylesheet" href="../static/css/admin.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/treeTable/jquery.treetable.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/treeTable/jquery.treetable.theme.default.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/datatables/jquery.dataTables.css" type="text/css">
<link rel="stylesheet" href="../static/plugins/datepicker/datepicker3.css" type="text/css">
<style>
.ul_tree_display {
	display: none;
}

.tr_tree_display {
	display: none;
}

.table>tbody>tr>td {
	vertical-align: middle;
	font-size: 0.8em;
}

.layui-layer-content p {
	padding: 15px;
}

.dataTables_length {
	margin-top: 10px;
}
</style>
<div class="tabs-panel">
	<div class="row">
		<div class="col-lg-2 col-md-3">
			<div class="list-group service_list">
				<?php if (is_array($service_type) && count($service_type) > 0)foreach ($service_type as $num=>$type){?>
				<a href="javascript:;" data-key="<?=$type['config_key']?>" data-val="<?=$type['config_value']?>" onclick="showPanel(<?=$type['config_key']?>,this);" class="list-group-item <?=!$num ? 'active' : ''?>"><?=$type['config_title']?></a>
				<?php }?>
			</div>
		</div>
		<div class="col-xs-9">
			<div class="box">
				<div class="box-body">
					<form name="theFormBasic" action="/service-vip/save-service-vip" id="theFormBasic" class="form-horizontal">
						<input type="hidden" name="service_key" id="service_key"/>
						<input type="hidden" name="service_val" id="service_val"/>
						<input type="hidden" name="service_title" id="service_title"/>
						<h3 class="service_title">产品基本信息</h3>
						<div class="row">
                        	<div class="form-group form-group-sm col-lg-4">
                          		<label class="col-sm-4 control-label"><span class="text-danger">*</span> 姓名：</label>
                            	<div class="col-sm-6">
                              		<input type="text" class="form-control" name="cust_name" id="cust_name" required="true" minlength="2" maxlength="30" placeholder="请输入您的姓名" value="" title="请输入产品名称，长度在 2 到 30 个字符！" />
                              	</div>
                          	</div>
                          	<div class="form-group form-group-sm col-lg-4">
                              	<label class="col-sm-4 control-label"><span class="text-danger">*</span> 联系方式：</label>
                                <div class="col-sm-6">
                               		<input type="text" class="form-control" name="cust_tel" id="cust_tel" placeholder="请输入您的联系方式" value="" title="请输入产品名称，长度在 2 到 30 个字符！" />
                                </div>
                          	</div>
						</div>
						<div class="row">
							<div class="form-group form-group-sm col-lg-4">
                              	<label class="col-sm-4 control-label"><span class="text-danger">*</span> 省：</label>
                                <div class="col-sm-4">
                                	<select name="province_id" id="province_id" class="form-control">
                                		<option value="0">请选择</option>
                                		<?php if (is_array($sys_city) && count($sys_city) > 0)foreach ($sys_city as $province){?>
                                			<option value="<?=$province['id']?>"><?=$province['name']?></option>
                                		<?php }?>
                                	</select>
                               	</div>
                          	</div>
                          	<div class="form-group form-group-sm col-lg-4">
                              	<label class="col-sm-4 control-label"><span class="text-danger">*</span> 市：</label>
                                <div class="col-sm-4">
                                	<select name="city_id" id="city_id" class="form-control">
                                		<option value="0">请选择</option>
                                	</select>
                               	</div>
                          	</div>
                          	<div class="form-group form-group-sm col-lg-4">
                              	<label class="col-sm-4 control-label"><span class="text-danger">*</span> 县/区：</label>
                                <div class="col-sm-4">
                                	<select name="area_id" id="area_id" class="form-control">
                                		<option value="0">请选择</option>
                                	</select>
                               	</div>
                          	</div>
						</div>
						<div class="row">
							<div class="form-group form-group-sm col-lg-8">
                              	<label class="col-sm-2 control-label"><span class="text-danger">*</span> 详细地址：</label>
                                <div class="col-sm-10">
                                	<input name="address" id="address" class="form-control" placeholder="请填写详细地址" value=""/>
                               	</div>
                          	</div>
						</div>
						<div class="row other_project">
						</div>
						<div class="modal-footer">
                      		<div class="col-sm-offset-2 col-sm-10">
                            	<button type="button" class="btn btn-primary" id="do_save">提交</button>
                            	<button type="button" class="btn btn-default" onclick="window.location.href='http://www.i8956.com/index.php?m=expresschannel&amp;a=list'">返回列表</button>
                       		</div>
                        </div>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript" src="/static/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script type="text/javascript" src="/static/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/static/plugins/datatables/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/static/plugins/datatables/dataTables.bootstrap.min.js"></script>
<script type="text/javascript" src="/static/jBox/jquery.jBox-2.3.min.js"></script>
<script type="text/javascript" src="/static/jBox/i18n/jquery.jBox-zh-CN.js"></script>
<script type="text/javascript" src="/static/plugins/treeTable/jquery.treetable.js"></script>
<!-- 自定义js -->
<script type="text/javascript" src="/static/plugins/datepicker/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="/static/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script>
$(document).ready(function(){
	var where = $('.service_list').find('a').eq(0);
	showPanel(1,where);
});
var sys_city = <?=json_encode($sys_city)?>;

function showPanel(config_key,where){
	$(where).parent().find('.active').removeClass('active');
	$(where).addClass('active');
	var html = '';
	switch(config_key){
		case 1:
			//居家面积
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger">*</span> 居家面积：</label>';
			html += '<div class="col-sm-8">';
			<?php if(is_array($GLOBALS['_HOME_AREA_ARR']) && count($GLOBALS['_HOME_AREA_ARR']) > 0)foreach ($GLOBALS['_HOME_AREA_ARR'] as $home_area=>$home_area_name){?>
			html += '<label class="radio-inline "><input name="home_area" type="radio" <?=($home_area == 1 ? 'checked=""' : '')?> value="<?=$home_area?>"/> <?=$home_area_name?></label>';
			<?php }?>
			html += '</div>';
			html += '</div>';
			//希望到家时间
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger ">*</span> 希望到家时间：</label>';
			html += '<div class="col-sm-4">';
			html += '<input class="form-control" id="home_time" value="" type="text" placeholder="请选择到家时间" readonly name="home_time"/>';
			html += '</div>';
			html += '</div>';
			//服务需求
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger ">*</span> 服务需求：</label>';
			html += '<div class="col-sm-8">';
			html += '<textarea class="form-control" style="width:100%"  placeholder="请输入服务需求" name="service_demand"></textarea>';
			html += '</div>';
			html += '</div>';
			break;
		case 2:
			//具体需求
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger">*</span> 具体需求：</label>';
			html += '<div class="col-sm-10">';
			<?php if(is_array($GLOBALS['_CRM_SERVICE_PROJECT_BY']) && count($GLOBALS['_CRM_SERVICE_PROJECT_BY']) > 0)foreach ($GLOBALS['_CRM_SERVICE_PROJECT_BY'] as $service_project=>$service_project_name){?>
			html += '<label class="radio-inline "><input style="width:15px;height:15px;" name="service_project[]" type="checkbox" value="<?=$service_project?>"/> <?=$service_project_name?></label>';
			<?php }?>
			html += '</div>';
			html += '</div>';
			//希望到家时间
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger ">*</span> 希望到家时间：</label>';
			html += '<div class="col-sm-4">';
			html += '<input class="form-control" id="home_time" value="" type="text" placeholder="请选择到家时间" readonly name="home_time"/>';
			html += '</div>';
			html += '</div>';
			//服务需求
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger ">*</span> 服务需求：</label>';
			html += '<div class="col-sm-8">';
			html += '<textarea class="form-control" style="width:100%"  placeholder="请输入服务需求" name="service_demand"></textarea>';
			html += '</div>';
			html += '</div>';
			break;

		case 3:
			//检测范围
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger">*</span> 检测范围：</label>';
			html += '<div class="col-sm-10">';
			<?php if(is_array($GLOBALS['_SERVICE_RANGE_BY']) && count($GLOBALS['_SERVICE_RANGE_BY']) > 0)foreach ($GLOBALS['_SERVICE_RANGE_BY'] as $service_range=>$service_range_name){?>
			html += '<label class="radio-inline "><input style="width:15px;height:15px;" name="service_range[]" type="checkbox" value="<?=$service_range?>"/> <?=$service_range_name?></label>';
			<?php }?>
			html += '</div>';
			html += '</div>';
			//可到家检测时间
			html += '<div class="form-group form-group-sm col-lg-8">';
			html += '<label class="col-sm-2 control-label"><span class="text-danger ">*</span> 可到家检测时间：</label>';
			html += '<div class="col-sm-4">';
			html += '<input class="form-control" id="home_time" value="" type="text" placeholder="请选择检测时间" readonly name="home_time"/>';
			html += '</div>';
			html += '</div>';
			break;
	}
// 	$('#theFormBasic').find('.other_project').html(html);
	$('#theFormBasic').find('input').val('');
	$('#theFormBasic').find('select').val(0);
	$('#home_time').datepicker({
		dateFormat:'yy-mm-dd'
	}); 
}

$('#province_id').on('change',function(){
	var province_id = $(this).val();
	var city_html = '<option value="0">请选择</option>';
	sys_city.forEach(function (item) {
		if(province_id == item.id){
			var city_val = item.son_val;
			city_val.forEach(function (item1) {
				city_html += '<option value="'+item1.id+'">'+item1.name+'</option>';
			});
		}
    });
    $('#city_id').html(city_html);
    $('#area_id').html('<option value="0">请选择</option>');
});

$('#city_id').on('change',function(){
	var province_id = $('#province_id').val();
	var city_id = $(this).val();
	var area_html = '<option value="0">请选择</option>';
	sys_city.forEach(function (item) {
		if(province_id == item.id){
			var city_val = item.son_val;
			city_val.forEach(function (item1) {
				if(city_id == item1.id){
					var area_val = item1.son_val;
					area_val.forEach(function (item2) {
						area_html += '<option value="'+item2.id+'">'+item2.name+'</option>';
					});
				}
			});
		}
    });
    $('#area_id').html(area_html);
});

$('#do_save').on('click',function(){
	var service_key = $('.service_list').find('.active').attr('data-key');
	var service_val = $('.service_list').find('.active').attr('data-val');
	var service_title = $('.service_list').find('.active').text();
	var form = $('#theFormBasic');
	form.find('#service_key').val(service_key);
	form.find('#service_val').val(service_val);
	form.find('#service_title').val(service_title);
    var cust_name = $('#cust_name').val();
    if(cust_name == ''){
        $.jBox.error('请填写您的姓名', '错误');
        return false;
    }
    var cust_tel = $('#cust_tel').val();
    if(cust_tel == ''){
        $.jBox.error('请填写您的联系方式', '错误');
        return false;
    }
    var province_id = $('#province_id').val();
    if(province_id == '0'){
    	$.jBox.error('请选择您的所在省', '错误');
        return false;
    }
    var city_id = $('#city_id').val();
    if(city_id == '0'){
    	$.jBox.error('请选择您的所在市', '错误');
        return false;
    }
    var area_id = $('#area_id').val();
    if(area_id == '0'){
    	$.jBox.error('请选择您的所在县/区', '错误');
        return false;
    }
    var address = $('#address').val();
    if(address == ''){
    	$.jBox.error('请选择您的详细地址', '错误');
        return false;
    }
    $.post(form.attr('action'),form.serialize(),success,'json');
    return false;
	function success(data){
        if(data.code == 200)
        {
            $.jBox.tip('处理成功', 'success');
            window.setTimeout(function () {
                $('#hot-sale-modal').modal('hide');
                window.setTimeout(function () { table_list_reload(); }, 1000);
            }, 1000);
        }
        else{
            $.jBox.error(data.val, '错误');
        }
	}
});
</script>